html,
body {
    width: 100%;
    height: 100%;
    overflow: hidden;
}

body {
    background: url(../images/背景.png) no-repeat center /cover;
}

.background1 {
    width: 100%;
    height: 100%;
    background-attachment: fixed;
    z-index: 100;
    background: url(../images/图层1.png)no-repeat center center/cover;
}
.index-start {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0px;
    left: 0;
    z-index: 999;
    /* display: none; */
}

.index-message {
    position: relative;
    width: 700px;
    height: 100%;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    margin: auto;
}

.index-message img:nth-child(1) {
    position: absolute;
    top: 0;
    width: 700px;
    z-index: 2;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
}

.index-message img:nth-child(2) {
    width: 300px;
    position: absolute;
    right: 0;
    top: 0;
    left: 280px;
    bottom: 300px;
    margin: auto;
}

.index-message img:nth-child(3) {
    width: 80px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: -400px;
    margin: auto;
}
/* 加载页面 */

.load-page {
    position: absolute;
    left: 0;
    top: 0;
    display: none;
}

.Loading {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 500px;
    margin-left: -250px;
    margin-top: -200px;
    /* display: none; */
}

.bjt {
    width: 100%;
    height: 100%;
}

.load-page-1 {
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: 90;
    height: 22px;
    width: 324px;
    margin-left: -162.5px;
    margin-top: 99px;
}

.load-page-1 img {
    height: 22px;
    width: 0;
}
/* 游戏主题开始 */

.main {
    width: 100%;
    height: 100%;
    display: none;
    background: url(../images/图层12.png) no-repeat center center/cover;
}
/* 头部 */

.top {
    width: 1000px;
    height: 50px;
    position: absolute;
    z-index: 10;
    top: 50px;
    left: 50%;
    margin-left: -500px;
}

.top-img {
    float: left;
    margin-right: 60px;
    position: relative;
    height: 50px;
}

.top-img {
    float: left;
    margin-right: 60px;
    position: relative;
    height: 50px;
}

.top-img-box {
    position: absolute;
    left: 59px;
    top: 13px;
    z-index: 90;
    height: 26px;
    width: 140px;
    color: #fff;
    text-align: center;
    line-height: 26px;
    font-size: 20px;
    font-weight: 900;
}

.top-img-box img {
    height: 26px;
    width: 140px;
    position: absolute;
    top: 0;
    left: 0;
}

.top-img-box span {
    height: 26px;
    width: 140px;
    position: absolute;
    top: 0;
    left: 0;
}

.top-img-box1 {
    position: absolute;
    left: 320px;
    top: 16px;
    z-index: 90;
    height: 26px;
    width: 90px;
    color: #fff;
    text-align: center;
    line-height: 26px;
    font-size: 20px;
    font-weight: 900;
}

.top-img-box1 span {
    height: 26px;
    width: 90px;
    position: absolute;
    top: 0;
    left: 0;
}

.top-btn img {
    float: right;
    height: 50px;
}
/* 设置 */

.set {
    position: absolute;
    top: 50px;
    right: 20px;
    height: 150px;
    width: 50px;
}

.set-img {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 90;
    height: 50px;
}

.set-box {
    position: absolute;
    top: 0;
    left: 4px;
    z-index: 10;
    background-color: #74b7d7;
    width: 40px;
    height: 125px;
    border-radius: 15px;
    border: rgba(204, 204, 204, 0.781) 1px solid;
}

.box-btn {
    position: absolute;
    top: 20px;
    left: 0;
    width: 40px;
    height: 25px;
}

.box-btn-img {
    margin: auto;
    display: block;
    width: 25px;
}

.box-btn1 {
    position: absolute;
    top: 60px;
    left: 0;
    width: 40px;
    height: 22px;
}

.box-btn1-img {
    margin: auto;
    display: block;
    height: 25px;
}

.box-btn-img1 {
    position: absolute;
    left: 4px;
    top: -5px;
    height: 32px;
}

.box-btn1-img1 {
    position: absolute;
    left: 4px;
    top: -4px;
    height: 32px;
}
/* 字母 */

.game-zimu {
    width: 900px;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    margin: auto;
}

.game-zimu img {
    max-width: 70px;
    height: 78px;
    position: absolute;
}

.zimu-img {
    position: absolute;
    width: 700px;
    height: 500px;
    top: 105px;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    display: flex;
    justify-content: space-between;
}

.zimu-img-1 {
    position: absolute;
    top: 100px;
    width: 100%;
    display: flex;
    justify-content: space-between;
}

.zimu-img-2 {
    position: absolute;
    top: 200px;
    width: 100%;
    display: flex;
    justify-content: space-between;
}

.zimu-img-3 {
    position: absolute;
    top: 300px;
    width: 100%;
    display: flex;
    justify-content: space-between;
}

.zimu-img img {
    width: 76px;
    height: 80px;
}

.y {
    position: absolute;
    top: 400px;
    left: 249px;
}

.z {
    position: absolute;
    top: 400px;
    left: 377px;
}

.zimu-btn {
    height: 40px;
    position: absolute;
    left: 75%;
    top: 120px;
}
/* 挑战成功 */

.game-success {
    position: absolute;
    left: 0;
    top: 0;
    display: none;
}

.success-img {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 500px;
    margin-left: -250px;
    margin-top: -200px;
}

.success-btn {
    position: absolute;
    width: 100px;
    top: 527px;
    left: 50%;
    margin-left: -50px;
}
/* 挑战失败 */

.game-lose {
    position: absolute;
    width: 500px;
    height: 100%;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    display: none;
}
.success-btnn {
    position: absolute;
    width: 100px;
    top: 527px;
    left: 50%;
    margin-left: -50px;
}